import React from 'react';
import { Layout, Breadcrumb, Row, Col } from 'antd';
import Header from '../../components/Header';
import FilterBar from '../../components/FilterBar';
import ArticleList from '../../components/ArticleList';
import RelatedRecommend from '../../components/RelatedRecommend';

const { Content } = Layout;

const TechFrontier: React.FC = () => {
  return (
    <Layout style={{ minHeight: '100vh', background: '#181C23' }}>
      <Header />
      <Content style={{ padding: '0 50px', marginTop: 64 }}>
        <div style={{ background: 'transparent', padding: 0, minHeight: 280 }}>
          <Breadcrumb style={{ margin: '24px 0' }} className="breadcrumb-white">
            <Breadcrumb.Item>技术前沿</Breadcrumb.Item>
            <Breadcrumb.Item>大模型风云</Breadcrumb.Item>
          </Breadcrumb>
          <FilterBar />
          <Row gutter={24} style={{ marginTop: 24 }}>
            <Col span={16}>
              <ArticleList />
            </Col>
            <Col span={8}>
              <RelatedRecommend />
            </Col>
          </Row>
        </div>
      </Content>
    </Layout>
  );
};

export default TechFrontier; 